<template>
  <Card>
    <div slot="title">
      <Icon type="ios-lightbulb" size="16" class="mr-1" />
      今日健康建议
    </div>
    <div class="tip-item">
      <Icon type="ios-restaurant" size="20" class="tip-icon" />
      <div class="tip-content">
        <h4>饮食建议</h4>
        <p>建议低热量、高蛋白饮食，多吃蔬菜和水果，控制碳水化合物摄入</p>
      </div>
    </div>
    <div class="tip-item">
      <Icon type="ios-walk" size="20" class="tip-icon" />
      <div class="tip-content">
        <h4>运动建议</h4>
        <p>每天进行30-60分钟有氧运动，如快走、慢跑、游泳等</p>
      </div>
    </div>
  </Card>
</template>

<script>
export default {
  name: 'HealthTips'
}
</script>

<style lang="less" scoped>
.tip-item {
  display: flex;
  padding: 12px 0;
  border-bottom: 1px dashed #eee;
  &:last-child {
    border-bottom: none;
  }
}

.tip-icon {
  color: #2d8cf0;
  margin-right: 12px;
}

.tip-content {
  flex: 1;
  h4 {
    margin: 0 0 5px 0;
    font-size: 15px;
    color: #1f2d3d;
  }
  p {
    margin: 0;
    font-size: 13px;
    color: #8392a5;
    line-height: 1.5;
  }
}
</style>
